<template>
	<jn-page>
		<view class="wallet">
			<view class="wallet-bg">
				<view class="wallet-img">
					<u-image src="/static/bj.png" width="100%" mode="widthFix"></u-image>
				</view>
				<view class="wallet-hd">
					<view class="title">
						<text>可提金额</text>
					</view>
					<view class="ktje">
						<text>{{showmoney}}</text>
					</view>
				</view>
				<view class="wallet-card">
					<view class="wallet-card-hd">
						<text>提现金额</text>
					</view>
					<view class="wallet-card-box">
						<u-form>
							<u-form-item prop="amount" label-width="10">
								<u-input :border="border" placeholder="请输入提现金额" v-model="model.amount" type="text"></u-input>
								<u-button slot="right" size="mini" shape="circle" @click="getAmount">全部</u-button>
							</u-form-item>
						</u-form>
						<u-button @click="submit" shape="circle">提现</u-button>
					</view>
					<view class="wallet-desc">
						<text class="tt">提现说明</text>
						<view class="des u-flex-col">
							<text class="u-p-t-10">余额满10元可提现（手续费为百分之10），提现审核后三个工作日自动到支付宝（提现请绑定手机号对应的支付宝）。</text>
						</view>
					</view>
				</view>

			</view>
			
			<view class="wallet-note">
				<view class="wallet-note-item" v-for="(item, index) in txlist" :key="index">
					<view class="wallet-note-box">
						<view class="wallet-note-hd">
							<view>
								<view class="wallet-note-time">
									<text>提现时间</text>
									<text>{{item.create_at}}</text>
								</view>
								<view class="wallet-note-je">
									<text>提现金额：￥</text>
									<text>{{item.with_price}}</text>
								</view>
							</view>
							<view>
								<view class="wallet-note-stu">
									<text class="tbox" v-if="item.status == 1">审核中</text>
									<text class="tbox" v-if="item.status == 2">提现成功</text>
									<text class="tbox" v-if="item.status == 3">驳回</text>
								</view>
							</view>
						</view>
					</view>
				</view>
				
				
				
			</view>
		</view>
		<u-toast ref="uToast" />
	</jn-page>
</template>

<script>
	export default {
		data() {
			return {
				showmoney: "",
				model: {
					amount: ''
				},
				txlist:[],
				border: false,
				codeTips: '',
			}
		},
		onShow() {
			this.getmoney()
		},
		methods: {
			
			//提现前先检查提现帐号是否设置
			//    /wxapi/api/get_alipay
			
			//判断不为空的情况下啊
			//触发提现提交

			getmoney() { //all   1   2
				this.$u.post('/wxapi/api/get_withdrawal', {
					token: this.vuex_token.accessToken
				}).then(res => {
					if (res.code == 200) {
						this.showmoney = res.data.money;
						this.txlist = res.data.txlist;
					}
					return false;
				});
			},
			getAmount() {
				this.model.amount=this.showmoney;
			},
			submit() {
				
				
				//写个验证，金额大于5元可触发提现


				this.$u.post('/wxapi/api/set_withdrawal', {
					token: this.vuex_token.accessToken,
					money: this.model.amount
				}).then(res => {
					this.$refs.uToast.show({
						title:res.info,
						duration:'3000'
					});
					if (res.code == 200) {
						this.getmoney()
					}
					return false;
				});

			}
		}
	}
</script>

<style lang="scss" scoped>
	.wallet {

		.wallet-bg {
			.wallet-img {
				position: absolute;
				width: 100%;
				height: auto;
			}

			.wallet-hd {
				position: relative;
				top: 20rpx;
				width: 100%;

				.title {
					color: #FFFFFF;
					text-align: center;
				}

				.ktje {
					padding-top: 20rpx;
					font-size: 80rpx;
					color: #FFFFFF;
					text-align: center;
				}
			}

			.wallet-card {
				position: relative;
				background-color: #FFFFFF;
				margin: 30rpx;
				padding: 60rpx 30rpx;
				border-radius: 20rpx;
				.wallet-desc {
					margin-top: 40rpx;
					.tt{
						font-size: 24rpx;
						margin: 10rpx 0;
					}
					.des {
						font-size: 24rpx;
					}
				}
			}
		}

		
		.wallet-note {
			position: relative;
			.wallet-note-item {
				.wallet-note-box {
					background-color: #FFFFFF;
					padding: 30rpx;
					margin: 30rpx;
					border-radius: 20rpx;
					.wallet-note-hd {
						display: flex;
						flex-direction: row;
						justify-content: space-between;
						.wallet-note-stu {
							padding: 10rpx 0;
							.tbox {
								background-color: red;
								color: #FFFFFF;
								padding: 10rpx;
								font-size: 24rpx;
								border-radius: 10rpx;
								margin: 10rpx 0;
							}
						}
						.wallet-note-time {
							padding: 10rpx 0;
						}
						
					}
				}
			}
		}
	}
</style>
